<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>

    <head>
        <meta charset="UTF-8"/>
        <title>重庆中交运维监控系统</title>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <!-- end: Mobile Specific -->
        <link th:href="@{css/bootstrap.min.css}" rel="stylesheet"/>
        <link th:href="@{css/bootstrap-responsive.min.css}" rel="stylesheet"/>
        <link th:href="@{css/style.min.css}" rel="stylesheet"/>
        <link th:href="@{css/style-responsive.min.css}" rel="stylesheet"/>
        <link th:href="@{css/font-awesome.min.css}" rel="stylesheet"/>
        <script th:src="@{js/jquery.min.js}"></script>
        <link th:href="@{css/bootstrap-table.min.css}" rel="stylesheet"/>
        <script th:src="@{js/bootstrap-table.min.js}"></script>
        <script th:src="@{js/bootstrap-table-locale-all.min.js}"></script>
        <script th:src="@{js/bootstrap.min.js}"></script>
    </head>
    <title>错误日志</title>
    <style>
        .form-horizontal .controls {
            margin-left: 20px;
        }

        .right {
            float: right;
        }
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>

<body>
<!--头部-->
<!-- start: Header -->
<div class="navbar">
    <div class="navbar-inner">
        <div class="container-fluid">
            <a class="btn btn-navbar" data-toggle="collapse"
               data-target=".top-nav.nav-collapse,.sidebar-nav.nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <a id="main-menu-toggle" class="hidden-phone open"><i class="icon-reorder"></i></a>
            <div class="row-fluid">
                <a class="brand span2" target="_blank" href="https://www.cttic.cn/"
                   style="height:100%;"><span>重庆中交通信</span></a>
            </div>
            <!-- start: Header Menu -->
            <div class="nav-no-collapse header-nav">
                <ul class="nav pull-right">
                    <!---->
                    <li class="dropdown">
                        <a class="btn account dropdown-toggle" data-toggle="dropdown" href="#">
                            <div class="avatar">
                                <img src="images/1485075852959.jpg" alt="Avatar"/>
                            </div>
                            <div class="user">
                                <span class="hello">Welcome!</span>
                                <span class="name" id="login_right_phone"></span>
                            </div>
                        </a>
                        <ul class="dropdown-menu">
                            <!--<li><a href="#"><i class="icon-user"></i> 个人信息</a></li>-->
                            <li><a href="/loginout.html"><i class="icon-off"></i> 退出登录</a></li>
                        </ul>
                    </li>
                    <!-- end: User Dropdown -->
                </ul>
            </div>
            <!-- end: Header Menu -->
        </div>
    </div>
</div>
<!-- start: Header -->
<div class="container-fluid-full">
    <div class="row-fluid">
        <!--左侧菜单/-->
        <!-- start: Main Menu -->
        <div id="sidebar-left" class="span2" ontablet="span2" ondesktop="span2">
            <div class="nav-collapse sidebar-nav" style="height: auto !important;">
                <ul class="nav nav-tabs nav-stacked main-menu">
                    <li>
                        <a class="dropmenu" href="javascript:void(0);"><span>监控管理</span></a>
                        <ul style="display: block;">
                            <li><a class="submenu" href="server-group-list"><span>系统管理</span></a></li>
                            <li><a class="submenu" href="server-list"><span>服务器管理</span></a></li>
                            <li class="active"><a class="submenu" href="error-log-list"><span>错误日志</span></a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
        <!-- end: Main Menu -->
        <!-- start: Content -->

        <div id="content" class="span10">
            <div class="row-fluid">
                <div class="box span12">
                    <div class="box-content" style="display: block;">
                        <table class="table table-striped table-bordered table-hover" id="errorLogTable">
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <!-- end: Content -->
    </div>
    <footer>
        <p>
            <span style="text-align:left;">Copyright &copy; 2014-2018 重庆中交通信  All rights reserved.</span>
        </p>
    </footer>
</div>

</body>
<script>
    $(function () {
        //左侧菜单下拉效果
        $('.dropmenu').click(function () {
            var $ul = $(this).siblings('ul');
            if ($ul.is(':visible')) {
                $(this).siblings('ul').hide(500);
            } else {
                $(this).siblings('ul').show(500);
            }
        });
        //控制高度
        var wh = $(window).height() - 90;
        $('#content').css('min-height', wh);
        //左侧菜单隐藏
        $('.icon-reorder').click(function () {
            if ($('#sidebar-left').is(':visible')) {
                $('#sidebar-left').hide();
                $('#content').addClass('full');
                $('#main-menu-toggle').addClass('close');
                $('.brand').addClass('noBg');
            } else {
                $('#sidebar-left').show();
                $('#content').removeClass('full');
                $('#main-menu-toggle').removeClass('close');
                $('.brand').removeClass('noBg');
            }

        });
    });
</script>


<script type="text/javascript">
    //---先销毁表格 ---
    $('#errorLogTable').bootstrapTable('destroy');
    //---初始化表格,动态从服务器加载数据---
    $('#errorLogTable').bootstrapTable({
        //【发出请求的基础信息】
        url: '/error-log-list1',
        method: 'post',
        contentType: "application/x-www-form-urlencoded",
        //【其它设置】
        locale: 'zh-CN',//中文支持
        pagination: true,//是否开启分页（*）
        pageNumber: 1,//初始化加载第一页，默认第一页
        pageSize: 10,//每页的记录行数（*）
        pageList: [20, 30, 40],//可供选择的每页的行数（*）
        sidePagination: "client", //分页方式：client客户端分页，server服务端分页（*）
        showRefresh: true,//刷新按钮
        search: true,//是否显示表格搜索，此搜索是客户端搜索，不会进服务端
        //【设置列】
        columns: [
            {
                field: 'num', title: '序号',
                formatter: function (value, row, index) {
                    return index + 1;
                }
            },
            {field: 'groupName', title: '系统名称'},
            {field: 'serverName', title: '服务名'},
            {field: 'ip', title: 'ip地址'},
            {field: 'port', title: '端口号'},
            {field: 'errorMsg', title: '错误信息'}
        ]
    })
    //动态添加下拉列表
    //fixeerrorSelectd-table-toolbar
    var select = '系统名称：<select class="form-control" id="errorSelect" onchange="conditionQuery()">' +
        '<option value="0">----请选择系统----</option>';
    var temp = '';
    //动态加载数据
    $.ajax({
        type: "post",
        url: '/server-group-list1',
        success: function (data) {
            var serverGroup = JSON.parse(data);
            for (var i = 0; i < serverGroup.length; i++) {
                temp = temp + '<option value="">serverGroup[i].groupName</option>';
            }
        },
        error: function (data) {
            alert("error！")
        }
    });

    $('.fixed-table-toolbar').append(select + temp + '</select>');

    function conditionQuery() {
        var text = $("#errorSelect").find("option:selected").text();
        var value = $('#errorSelect').val();
        if (value == '0') {
            location.reload();
            return;
        }
        var opt = {
            url: "/error-log-list1",
            silent: true, //静默刷新
            query: {
                //请求参数
                groupName: text
            }
        };
        $("#errorLogTable").bootstrapTable('refresh', opt);
    }
</script>

</html>